.quick-module-1 {
  overflow: hidden;
  padding: rpx(40) rpx(30) rpx(20);
  box-sizing: border-box;
  background-color: #fff;
  .navs {
    width: 100%;
    height: rpx(60);
    overflow: auto;
    font-size: 0;
    .nav-list {
      display: inline-flex;
      white-space: nowrap;
      .item {
        white-space: nowrap;
        padding: 0 rpx(26);
        height: rpx(52);
        line-height: rpx(52);
        border-radius: rpx(26);
        position: relative;
        font-size: rpx(28);
        color: #000000;
        &.active {
          color: #fff;
          background-color: #FF2E30;
          &::after {
            content: '';
            width: 0;
            height: 0;
            border-left: rpx(8) solid transparent;
            border-right: rpx(8) solid transparent;
            border-top: rpx(8) solid #FF2E30;
            position: absolute;
            top: 100%;
            left: 50%;
            transform: translateX(-50%);
          }
        }
      }
    }
  }
  .lists {
    width: 100%;
    margin-top: rpx(20);
    height: rpx(46);
    font-size: 0;
    overflow: auto;
    .list {
      display: inline-flex;
      white-space: nowrap;
      .item {
        padding: 0 rpx(24);
        height: rpx(46);
        line-height: rpx(46);
        background: #F6F6F6;
        border-radius: rpx(23);
        font-size: rpx(24);
        color: #666666;
        margin-right: rpx(16);
        &.active {
          background-color: #FFE4E4;
          color: #FF2E30;
        }
      }
    }
  }
  .school-list {
    padding-top: rpx(16);
    padding-bottom: rpx(8);
    .item {
      width: rpx(692);
      background: #FFFFFF;
      box-shadow: 0px 0px 0.13rem 0px rgba(188,185,185,0.7);
      border-radius: rpx(10);
      margin: rpx(24) auto;
      overflow: hidden;
      box-sizing: border-box;
      padding: rpx(40) rpx(20);
      @include flex(row,flex-start,center);
      position: relative;
      .image {
        width: rpx(150);
        height: rpx(150);
        overflow: hidden;
        margin-right: rpx(16);
        img {
          display: block;
          width: 100%;
          height: 100%;
          object-fit: cover;
        }
      }
      .infos {
        flex: 1;
        .name {
          font-size: rpx(26);
          line-height: 1.1;
          color: #000000;
          margin-bottom: rpx(20);
        }
        .signs {
          @include flex(row,center,flex-start);
          margin-bottom: rpx(20);
          .sign {
            padding: 0 rpx(12);
            height: rpx(30);
            background: #F6EDFE;
            border-radius: rpx(15);
            margin-right: rpx(7);
            font-size: rpx(20);
          }
          .sign-1 {
            color: #B562FF;
            background-color: #F6EDFE;
          }
          .sign-2 {
            color: #FF9B55;
            background-color: #FFF2E9;
          }
          .sign-3 {
            color: #5478FE;
            background-color: #ECF0FF;
          }
          .sign-4 {
            color: #40ADA1;
            background-color: #E5F7F5;
          }
        }
        .intro {
          font-size: rpx(20);
          color: #333333;
          line-height: 1.6;
        }
      }
      .btn {
        width: rpx(126);
        height: rpx(46);
        line-height: rpx(42);
        text-align: center;
        border: rpx(2) solid #FFAFB0;
        border-radius: rpx(23);
        position: absolute;
        top: rpx(20);
        right: rpx(30);
        box-sizing: border-box;
        font-size: rpx(20);
        color: #FF2E30;
      }
    }
  }
}

.paginations {
  @include flex;
  .btn {
    width: rpx(56);
    height: rpx(56);
    border: 1px solid #DBDBDB;
    border-radius: 50%;
    &.prev {
      span {
        display: block;
        position: relative;
        @include arrow(56,#cacaca, 4, 225);
        left: 55%;
        transform: translateX(-50%);
      }
    }
    &.next {
      span {
        display: block;
        position: relative;
        @include arrow(56,#cacaca, 4);
        left: 45%;
        transform: translateX(-50%);
      }
    }
  }
  .pages {
    @include flex;
    border: 1px solid #DBDBDB;
    margin: 0 rpx(20);
    .page {
      height: rpx(56);
      width: rpx(54);
      line-height: rpx(56);
      color: #000000;
      text-align: center;
      font-size: rpx(30);
      border-left: 1px solid #DBDBDB;
      &:first-child {
        border-left: none;
      }
      &.active {
        background-color: #FF2E30;
        color: #fff;
      }
    }
  }
}

.quick-module-2 {
  .news-wrapper {
    overflow: auto;
    font-size: 0;
    padding-bottom: rpx(32);
    .news-list {
      display: inline-flex;
      // white-space: nowrap;
      .item {
        width: rpx(456);
        height: rpx(370);
        background: linear-gradient(0deg, #FFFFFF 0%, #C9DAFB 100%);
        box-shadow: 0px 0px 0.13rem 0px rgba(188,185,185,0.7);
        border-radius: rpx(20);
        margin-right: rpx(28);
        overflow: hidden;
        .head {
          @include flex(row,flex-end,center);
          margin-bottom: rpx(20);
          .rank {
            width: rpx(50);
            height: rpx(70);
            margin-left: rpx(33);
            margin-right: rpx(31);
            font-size: rpx(32);
            color: #FFFFFF;
            font-weight: bold;
            text-align: center;
            @include flex(row,flex-end,center);
            box-sizing: border-box;
            padding-bottom: rpx(6);
            position: relative;
          }
          .bt {
            flex: 1;
            font-size: rpx(32);
            font-weight: bold;
          }
        }
        .box {
          width: rpx(419);
          height: rpx(263);
          margin: 0 auto;
          background: #FFFFFF;
          border-radius: rpx(20);
          box-sizing: border-box;
          padding: rpx(12) rpx(30) 0;
          display: block;
          white-space: wrap;
          .sub {
            width: 100%;
            display: block;
            font-size: rpx(20);
            line-height: rpx(32);
            height: rpx(64);
            overflow: hidden;
            color: #000000;
            word-break: break-all;
            margin: rpx(16) 0;
            @include clamp;
            span {
              color: #FF2E30;
            }
          }
        }
      }
      .item-1 {
        background: linear-gradient(0deg, #FFFFFF 0%, #C9DAFB 100%);
        .rank {
          background: linear-gradient(178.36deg, #A7B5EB 0%, #8098F0 100%);
          &:after {
            content: '';
            width: 0;
            height: 0;
            border-left: rpx(25) solid transparent;
            border-right: rpx(25) solid transparent;
            border-top: rpx(10) solid #8098F0;
            position: absolute;
            top: 100%;
            left: 0;
          }
        }
        .bt {
          color: #2D3383;
        }
      }
      .item-2 {
        background: linear-gradient(0deg, #FEFEFE 0%, #F5DEBA 100%);
        .rank {
          background: linear-gradient(178.36deg, #ECC3A5 0%, #C68860 100%);
          &:after {
            content: '';
            width: 0;
            height: 0;
            border-left: rpx(25) solid transparent;
            border-right: rpx(25) solid transparent;
            border-top: rpx(10) solid #C68860;
            position: absolute;
            top: 100%;
            left: 0;
          }
        }
        .bt {
          color: #4C210A;
        }
      }
      .item-3 {
        background: linear-gradient(0deg, #FEFEFE 0%, #d3baf5 100%);
        .rank {
          background: linear-gradient(178.36deg, #c19cf0 0%, #873dec 100%);
          &:after {
            content: '';
            width: 0;
            height: 0;
            border-left: rpx(25) solid transparent;
            border-right: rpx(25) solid transparent;
            border-top: rpx(10) solid #873dec;
            position: absolute;
            top: 100%;
            left: 0;
          }
        }
        .bt {
          color: #873dec;
        }
      }
    }
  }
  .list {
    overflow: hidden;
    .item {
      float: left;
      border-radius: rpx(8);
      height: rpx(62);
      margin-right: rpx(16);
      margin-bottom: rpx(16);
      @include flex;
      box-sizing: border-box;
      padding-left: rpx(8);
      padding-right: rpx(16);
      .icon {
        width: rpx(45);
        height: rpx(45);
        margin-right: rpx(15);
      }
      .name {
        flex: 1;
        overflow: hidden;
        font-size: rpx(20);
      }
    }
  }
}

.news-detail-container {
  background-color: #fff;
  padding: rpx(30) rpx(30) 0;
  box-sizing: border-box;
  overflow: hidden;
  .title {
    font-size: rpx(38);
    color: #343434;
    font-weight: bold;
    line-height: 1.6;
    span {
      display: block;
      transform: translateX(-0.2rem);
    }
  }
  .info {
    font-size: rpx(24);
    color: #666666;
    padding: rpx(30) 0;
    line-height: 1.2;
  }
  .content {
    font-size: rpx(26);
    color: #404040;
    line-height: 2;
    text-align: justify;
  }
  .skip-item {
    height: rpx(104);
    background: #F2F2F2;
    margin: rpx(25) 0;
    @include flex;
    box-sizing: border-box;
    padding-right: rpx(20);
    .left {
      width: rpx(138);
      height: rpx(54);
      line-height: rpx(54);
      text-align: center;
      border-right: 1px solid #BFBFBF;
      font-size: rpx(30);
      color: #979797;
      margin-right: rpx(30);
    }
    .right {
      flex: 1;
      overflow: hidden;
      line-height: 1.2;
      .title {
        font-size: rpx(30);
        color: #000000;
        margin-bottom: rpx(4);
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
      }
      .time {
        font-size: rpx(19);
        color: #767676;
      }
    }
  }
}

.news-detail-wrapper {
  width: 100%;
  height: rpx(166);
  background: #FFFFFF;
  box-shadow: 0px 0px 0.16rem 0px #D9D9D9;
  border-radius: rpx(10);
  @include flex(row,center,space-around);
  .item {
    @include flex(column);
    .icon {
      width: rpx(97);
      height: rpx(97);
    }
    .name {
      line-height: 1.1;
      font-size: rpx(20);
      color: #000000;
    }
  }
}

.school-fee-modal {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100vw;
  height: 100vh;
  z-index: 99;
  .bg {
    width: 100%;
    height: 100%;
    background-color: #00000080;
  }
  .wrapper {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    background-color: #fff;
    border-radius: rpx(40) rpx(40) 0 0;
    @include flex(column);
    overflow: hidden;
    .head {
      width: 100%;
      height: rpx(114);
      margin-top: rpx(24);
      box-sizing: border-box;
      padding: 0 rpx(50);
      @include flex(row,center,flex-start);
      .title {
        color: #010101;
        font-size: rpx(38);
        font-weight: bold;
        margin-right: rpx(30);
        span {
          color: #FF4E51;
        }
      }
      .label {
        width: rpx(110);
        height: rpx(38);
        line-height: rpx(38);
        text-align: center;
        background: #FF4E51;
        border-radius: rpx(10);
        font-size: rpx(20);
        color: #FFFFFF;
      }
      .close {
        position: absolute;
        top: rpx(12);
        right: rpx(12);
        @include close(0.88rem);
      }
    }
    .content {
      width: calc(100% - 0.72rem);
      box-sizing: border-box;
      padding-right: rpx(34);
      padding-left: rpx(14);
      margin: auto;
      max-height: calc(80vh - 3.08rem);
      overflow: auto;
      font-size: rpx(24);
      color: #333333;
      line-height: 1.8;
      .border {
        border-bottom: 1px dashed #ddd;
        width: 100%;
        margin: rpx(30) 0;
      }
      .title {
        line-height: 1.2;
        font-size: rpx(28);
        color: #FF4E51;
        padding-left: rpx(30);
        position: relative;
        &:after {
          content: '';
          width: rpx(6);
          height: rpx(22);
          background-color: #FF4E51;
          position: absolute;
          left: 0;
          top: 50%;
          transform: translateY(-50%);
        }
      }
    }
    .foot {
      width: 100%;
      height: rpx(170);
      @include flex;
      .btn {
        width: rpx(310);
        height: rpx(76);
        line-height: rpx(76);
        text-align: center;
        background: #FF4E51;
        border-radius: rpx(38);
        font-size: rpx(26);
        color: #fff;
      }
    }
  }
}


.date-screen {
  margin-bottom: rpx(35);
  overflow: auto;
  .date-list {
    font-size: 0;
    display: inline-flex;
    white-space: nowrap;
    padding-bottom: rpx(24);
    box-sizing: border-box;
    .item {
      height: rpx(180);
      width: rpx(146);
      background-color: #FF2E30;
      @include flex(column);
      &:first-child {
        border-radius: rpx(12) 0 0 rpx(12);
      }
      &:last-child {
        border-radius: 0 rpx(12) rpx(12) 0;
      }
      color: #fff;
      .time {
        font-size: rpx(24);
        transition: all 100ms;
      }
      .status {
        font-size: rpx(28);
        transition: all 100ms;
      }
      &.item-2 {
        color: #ffffff90;
      }
      &.active {
        position: relative;
        .time, .status {
          font-size: rpx(40);
          font-weight: bold;
        }
        &::after {
          content: '';
          width: rpx(68);
          height: rpx(20);
          position: absolute;
          top: 100%;
          left: 50%;
          transform: translateX(-50%);
          background: url('../images/privateSchool/arrow.png') no-repeat center;
          background-size: 100% 100%;
        }
      }
    }
  }
}

.goods-list {
  padding-top: rpx(10);
  .item {
    margin: rpx(14) 0;
    background: #FFFFFF;
    box-shadow: 0px 0px 0.13rem 0px rgba(188,185,185,0.7);
    border-radius: rpx(10);
    box-sizing: border-box;
    padding: rpx(36) rpx(24);
    @include flex;
    .left {
      width: rpx(194);
      margin-right: rpx(24);
      @include flex(column);
      .photo {
        width: 100%;
        height: rpx(129);
        overflow: hidden;
        margin-bottom: rpx(20);
        display: block;
        img {
          width: 100%;
          height: 100%;
          object-fit: cover;
        }
      }
      .btn-1 {
        width: rpx(126);
        height: rpx(46);
        border: 1px solid #FFAFB0;
        border-radius: rpx(23);
        @include flex;
        text-align: center;
        color: #FF2E30;
        font-size: rpx(20);
      }
      .btn-2 {
        width: rpx(126);
        height: rpx(46);
        background: #F0F0F0;
        border-radius: rpx(23);
        @include flex;
        text-align: center;
        color: #838383;
        font-size: rpx(20);
        background-color: #F0F0F0;
      }
      .city {
        margin-top: rpx(12);
        font-size: rpx(20);
        color: #999999;
      }
    }
    .right {
      flex: 1;
      overflow: hidden;
      display: block;
      .name {
        font-size: rpx(26);
        line-height: 1.4;
        color: #000000;
        margin-bottom: rpx(14);
      }
      .time {
        height: rpx(38);
        background: #FF4E51;
        border-radius: rpx(10);
        box-sizing: border-box;
        padding: 0 rpx(24);
        position: relative;
        margin-bottom: rpx(18);
        &:after {
          content:'';
          width: 0;
          height: 0;
          border-left: rpx(10) solid transparent;
          border-right: rpx(10) solid transparent;
          border-top: rpx(10) solid #fff;
          position: absolute;
          top: 50%;
          right: rpx(16);
          transform: translateY(-50%);
        }
        span {
          font-size: rpx(20);
          color: #FFFFFF;
        }
      }
      .address {
        font-size: rpx(20);
        color: #0D5DFF;
        line-height: 1.4;
        margin-bottom: rpx(16);
      }
      .intro {
        padding: rpx(14) rpx(20);
        background: #F5F5F5;
        border-radius: rpx(10);
        font-size: rpx(20);
        color: #333333;
        span {
          display: block;
          line-height: rpx(34);
          height: rpx(68);
          overflow: hidden;
          @include clamp;
        }
      }
    }
  }
}

.school-detail-1 {
  width: rpx(693);
  background: #FFFFFF;
  border-radius: rpx(10);
  margin: auto;
  overflow: hidden;
  box-sizing: border-box;
  padding: rpx(38) rpx(30);
  position: relative;
  .m0 {
    width: rpx(150);
    position: absolute;
    top: rpx(42);
    right: rpx(49);
    img {
      width: 100%;
    }
  }
  .m1 {
    overflow: hidden;
    border-bottom: 1px dashed #BBBBBB;
    padding-bottom: rpx(12);
    .t1 {
      @include flex(row,center,flex-start);
      margin-bottom: rpx(30);
      .name {
        font-size: rpx(38);
        color: #000000;
        font-weight: bold;
        margin-right: rpx(38);
      }
      .area {
        height: rpx(24);
        font-size: rpx(20);
        padding-left: rpx(24);
        box-sizing: border-box;
        background: url('../images/icon/addr-icon.png') no-repeat left center;
        background-size: rpx(16) auto;
      }
    }
    .t2 {
      overflow: hidden;
      margin-bottom: rpx(26);
      .item {
        width: rpx(86);
        height: rpx(43);
        line-height: rpx(43);
        text-align: center;
        border-radius: rpx(10);
        font-size: rpx(22);
        margin-right: rpx(14);
        float: left;
      }
      .item-1 {
        background: #EBF9F9;
        color: #45C1BB;
      }
      .item-2 {
        background: #EBF3FE;
        color: #3C85E9;
      }
      .item-3 {
        background: #F2EBF9;
        color: #B67AF2;
      }
      .item-4 {
        background: #F9F2EB;
        color: #FFA851;
      }
    }
    .t3 {
      margin-bottom: rpx(24);
      font-size: rpx(24);
      color: #000000;
      text-decoration: underline;
      span {
        color: #666;
      }
    }
  }
  .m2 {
    padding: rpx(30) 0;
    font-size: rpx(22);
    color: #333;
    line-height: 1.6;
    span {
      color: #666;
    }
    a {
      color: #FF2E30;
    }
  }
  .m3 {
    width: 100%;
    box-sizing: border-box;
    background: #FFF9F8;
    border-radius: 10px;
    padding: rpx(20) rpx(0) rpx(20) rpx(30);
    font-size: rpx(22);
    color: #000000;
    margin-bottom: rpx(20);
    overflow: hidden;
    .item {
      height: rpx(42);
      line-height: rpx(42);
      padding-left: rpx(20);
      float: left;
      margin-right: rpx(20);
      position: relative;
      &:after {
        content: '';
        width: rpx(13);
        height: rpx(13);
        border-radius: 50%;
        background-color: #fff;
        box-sizing: border-box;
        border: 2px solid #FF4E51;
        position: absolute;
        top: 50%;
        left: 0;
        transform: translateY(-50%);
      }
    }
  }
  .m4 {
    width: 100%; display: block;
    height: rpx(80);
    line-height: rpx(80);
    font-size: rpx(21);
    color: #000000;
    box-sizing: border-box;
    padding-left: rpx(32);
    background: url('../images/icon/map.png') no-repeat center;
    background-size: cover;
  }
}

.school-detail-2 {
  width: rpx(693);
  background: #FFFFFF;
  border-radius: rpx(10);
  margin: rpx(18) auto rpx(32);
  overflow: hidden;
  box-sizing: border-box;
  padding: rpx(54) rpx(38);
  position: relative;
  .bt {
    text-align: center;
    font-size: rpx(30);
    color: #000000;
    font-weight: bold;
    line-height: 1.2;
    margin-bottom: rpx(20);
  }
  .form {
    overflow: hidden;
    .form-item {
      @include flex;
      height: rpx(88);
      .label {
        width: rpx(130);
        font-size: rpx(26);
        color: #000000;
      }
      .val {
        flex: 1;
        overflow: hidden;
        @include flex(row,center,flex-start);
        border-bottom: 1px solid #eee;
        &.radio-box {
          border-bottom: none;
          label {
            span {
              display: block;
              width: rpx(136);
              height: rpx(54);
              line-height: rpx(54);
              background: #FFFFFF;
              border: rpx(2) solid #A8A8A8;
              border-radius: rpx(10);
              text-align: center;
              margin-right: rpx(36);
              font-size: rpx(25);
              color: #000000;
              overflow: hidden;
            }
            input:checked + span {
              border-color: #FF4E51;
              color: #FF4E51;
              background: url('../images/icon/radio.png') no-repeat right bottom;
              background-size: rpx(39) auto;

            }
          }
        }
        input {
          flex: 1;
          overflow: hidden;
          height: rpx(64);
          font-size: rpx(24);
          width: 100%;
          box-sizing: border-box;
          &.radio {
            display: none;
          }
        }
        .icon {
          width: rpx(36);
          margin-right: rpx(14);
        }
      }
    }
    .btn {
      width: 3.72rem;
      height: 0.88rem;
      line-height: 0.88rem;
      text-align: center;
      border-radius: 0.44rem;
      margin: rpx(30) auto 0;
      font-size: rpx(29);
      color: #fff;
      background-color: rgb(255, 46, 48);
    }
  }
}